<template>
	<view style="padding: 20rpx;">
		
		<u-navbar back-text="" :leftIconColor="tksetting.titlecolor" :bgColor="tksetting.color" :titleStyle="{color:tksetting.titlecolor}" :title="title"  :autoBack="true"  :placeholder="true">
			
		</u-navbar>
		
		<view  v-show="active==index"  v-for="(item,index) in fenye" :key="index">
			
			<view v-if="index==0" style="padding: 12rpx 0;">
				<u-parse :content="z_info.content"></u-parse>
			</view>
			
			<view v-if="item.title" style="padding: 12rpx 0;border-bottom: 1px #eaeaea solid; font-weight: 600;">
				<u-parse :content="item.title"></u-parse>
			</view>
			<view v-for="(wj,i) in wenjuanList[index]" :key="i">
				<wenjuan class="wenjuan" 
				:hasOther="wj.hasOther" 
				:type="wj.type" 
				:value="wj.value" 
				:maxSelect="wj.maxSelect" 
				:title="wj.title" 
				:subTitle="wj.subTitle" 
				:defaultValue="wj.defaultValue" 
				:isbt="wj.isbt"
				@change="change($event,wj.id,wj.name)" @send="sendCode($event,wj.id,wj.name)"></wenjuan>
			</view>
			<u-gap height="30"></u-gap>
			<view style="display: flex; gap: 20rpx; justify-content: space-around;">
				<u-button
				 text="上一页" @tap="change_prv(index)"></u-button>
				<u-button
				 text="下一页" @tap="change_nex(index)"></u-button>
			</view>
		</view>
		
		
		<u-gap height="30"></u-gap>
		<u-button v-if="is_tijiao==1"  :color="tksetting.color" text="提交问卷" @tap="submit"></u-button>
		<u-gap height="30"></u-gap>
	</view>
</template>

<script>
	import {toast,showModal,wxcode,isImageUrlByExtension, clearStorageSync, setStorageSync, getStorageSync, useRouter} from '@/utils/utils.js'
	import wenjuan from '@/components/gwh-wenjuan/gwh-wenjuan.vue'
	import { mapState } from 'vuex';
	export default {
		components:{
			wenjuan
		},
		data() {
			return {
				active:0,
				id:'',
				xcxopenid:'',
				title:'问卷调查',
				fenye:[],
				z_info:[],
				wenjuanList:[
					
				]
			}
		},
		computed: {
			...mapState(['user','shebei_info','tksetting','setting']),
			is_tijiao(){
				if((this.active+1)==this.fenye.length){
					return 1;
				}else{
					return 0;
				}
				
			}
		},
		async onLoad(opt) {
			
			// #ifdef MP-WEIXIN
			 const xcxopenid=getStorageSync('openid');
			   if(xcxopenid){
				    this.xcxopenid=xcxopenid;
			   }else{
					 const data= await wxcode();
					 const wx_info=await this.$api.wxlogin({code:data.code})
					 const openids=JSON.parse(wx_info.data[1]);
					 if(openids.errcode){
									   toast('小程序获取信息失败')
					 }else{
						this.xcxopenid=openids.openid
					 }  
			   }
			// #endif
			
			try{
				const params = JSON.parse(decodeURIComponent(opt.data));
				this.id = params.id;
			}catch(e){
				
			}
			
			this.init();
		},
		methods: {
			init(){
				this.$api.wenjuan_info({id:this.id,xcxopenid:this.xcxopenid}).then(res=>{
					console.log({id:this.id,xcxopenid:this.xcxopenid})
					if(res.code==0){
						this.fenye=res.z_info.fenye;
						this.z_info=res.z_info;
						this.wenjuanList=res.data;
						this.title=res.title
					}else{
						uni.showModal({
							title:"系统提示",
							showCancel:false,
							content:res.msg,
							success(re) {
								if(re.confirm){
									uni.navigateBack();
								}
							}
						})
					}
				})
			},
			change_prv(e){
				if(this.active>0){
					this.active=e-1
					
					uni.pageScrollTo({
						scrollTop: 0,
						duration: 300
					});
					
				}else{
					toast('已经第一页')
				}
			},
			change_nex(e){
				console.log(this.fenye.length)
				console.log(this.active)
				if((this.active+1)<this.fenye.length){
					
					uni.pageScrollTo({
						scrollTop: 0,
						duration: 300
					});
					
					this.active=e+1
				}else{
					toast('已经最后一页')
				}
			},
			change(e,...res){
				
				//console.log(e);
				//console.log(res);
				//用于更新数据
				for(var ii=0;ii<this.fenye.length;ii++){
					for(var i=0;i<this.wenjuanList[ii].length;i++){
						if(this.wenjuanList[ii][i].id == res[0]){
							this.wenjuanList[ii][i].resultValue = e;
						}
					}
				}
				
				
			},
			sendCode(e,...res){
				//console.log("please send check code to the phone:"+e[0])
				//console.log(res);
			},
			submit(){
				
				//console.log(this.wenjuanList)
				let questlist_tj='';
				let yz=true;
				let yztest=true;
				
				for(var ii=0;ii<this.fenye.length;ii++){
					for(var i=0;i<this.wenjuanList[ii].length;i++){
						questlist_tj+=this.wenjuanList[ii][i].id+'-'+this.wenjuanList[ii][i].resultValue.filter(el => el != null && el !== '').join(',')+'|'
						
						if(!this.wenjuanList[ii][i].isbt){
							if(!this.wenjuanList[ii][i].resultValue.some(el => el !== '')){
								this.active=ii;
								toast('第'+(ii+1)+'页:'+this.wenjuanList[ii][i].subTitle+"为必填项")
								yz=false;
								return false;
							}
						}
					}
				}
				
			
				if(yz && yztest){
					const _this=this;
					_this.$api.wenjuan_tj({
						'anser':questlist_tj,
						'ksid':_this.id,
						'xcxopenid':this.xcxopenid
					}).then(re=>{
						console.log(re)
						if(re.code==0){
							uni.removeStorageSync(this.storageKey);
							uni.$emit('updateValueInDataArr',{id:this.ksid})
							uni.navigateBack();
						}else{
							uni.showModal({
								title: '提交问卷',
								showCancel:false,
								content: re.msg,
								success(res) {
									if(res.confirm){
										uni.navigateBack();
									}
									
								}
							}); 
							
						}
						
						
					})
					//console.log(questlist_tj);
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wenjuan{line-height: 200%;}
	
	
	
</style>
